<template>
  <div class="deleteComp">
    <el-dialog
      title="确定删除吗?"
      :visible.sync="deleteDialogVisible"
      width="435px"
      :before-close="handleBeforeClose"
    >
      <span style=""
        ><em style="font-style: normal; color: red">删除后不可恢复</em
        >，你还要继续吗？</span
      >
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleCloseDeleteDialog">取 消</el-button>
        <el-button type="primary" @click="handleConfirmDel">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { debounce } from "lodash";

export default {
  name: "DeleteComp",
  props: {
    deleteDialogVisible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {};
  },
  methods: {
    handleCloseDeleteDialog() {
      this.$emit("update:deleteDialogVisible", false);
    },
    handleBeforeClose() {
      this.$emit("update:deleteDialogVisible", false);
    },
    handleConfirmDel: debounce(function() {
      this.$emit("handleConfirmDel");
    }, 500)
  }
};
</script>

<style lang="scss" scoped></style>
